
import CaptureComp from "../../engine/comps/CaptureComp";

const { ccclass, property } = cc._decorator;

@ccclass
export default class LianpuView extends cc.Component {


    @property(cc.Sprite)
    target: cc.Sprite = null;

    @property(CaptureComp)
    capture: CaptureComp = null;


    imgs: any[] = []


    protected color: cc.Color = cc.color(255, 255, 255)

    //shader 用到的坐标
    private x: number = -1.0
    private y: number = -1.0;

    //颜色数据
    protected dataList: any[] = []

    start() {


        this.node.on(cc.Node.EventType.TOUCH_START, this.touchStart, this)
        let count = this.node.childrenCount
        for (let index = 0; index < count; index++) {
            this.node.children[index].active = false;
        }

        let tempIndex: number = 0;
        for (let index = 0; index < count; index++) {
            if (index == tempIndex) {
                this.node.children[index].active = true;
                this.capture.render()
                this.dataList[index] = this.capture.getData()
            } else {
                this.node.children[index].active = false;
            }
            tempIndex++;
        }

        for (let index = 0; index < count; index++) {
            this.node.children[index].active = true;
        }

        this.setTarget(this.dataList[0])
    }



    setTarget(data) {

        if (this.target) {
            let tTexture = this.target.spriteFrame.getTexture()
            this.target.node.scaleY = -1
            tTexture.initWithData(data, tTexture.getPixelFormat(), this.node.width, this.node.height)

        }

    }



    touchStart(e: cc.Touch) {
        let posv = e.getLocation();
        posv = this.node.convertToNodeSpaceAR(posv)
        let x = posv.x + this.node.width * this.node.anchorX;
        let y = posv.y + this.node.height * this.node.anchorY;
        console.log(' x ', x, ' y ', y)
        this.x = x / this.node.width;
        this.y = (this.node.height - y) / this.node.height;
        // this.setPosition()

        for (let index = 0; index < this.dataList.length; index++) {
            const element = this.dataList[index];
            let a = this.getData(x, y, element, this.node.width)
            if (a != 0) {
                console.log(' a is ', a)
                this.node.children[index].color = this.color;
                break;
            }
          
        }
    }


    getData(x: number, y: number, data: ArrayBufferView, width:number) {
        let rowW = Math.floor(width) * 4//一行的长度
        x = Math.floor(x)
        let srow = Math.floor(y);//行开始位置
        let startX = srow * rowW + x * 4;//列开始位置 
        console.log(' row ', rowW, ' startX ', startX, data.byteLength)
        let r = data[startX + 0];
        let g = data[startX + 1]
        let b = data[startX + 2]
        let a = data[startX + 3]
        return a;
    }

    update() {

    }

    changeColor(c:cc.Color){
        this.color = c;
    }

    // setPosition() {
    //     for (let index = 0; index < this.mats.length; index++) {
    //         const element = this.mats[index];
    //         element.setProperty('touchPos', [this.x, this.y])
    //         // element.setProperty('touchColor', [this.color.r / 255, this.color.g / 255, this.color.b / 255])
    //     }
    // }

}
